import { useEffect } from "react";
import "./index.scss";
import { message } from "antd";
import Logo from "../../asserts/theme-logo.svg";
import Back from "../../asserts/theme-back.png";
import AccountLogin from "./AccountLogin";
import { getUrlParams } from "@src/tools/commonTool";
import API from "@src/api";

const { Logout } = API.globalAPI;

function Login() {
	useEffect(() => {
		let token = window.location.href.replace("#/login", "");
		const needClear = sessionStorage.getItem("AuthorizationCode");
		if (!!needClear) {
			Logout()
				.then((res) => {
					sessionStorage.removeItem("AuthorizationCode");
				})
				.catch(() => {
					sessionStorage.removeItem("AuthorizationCode");
				});
			return;
		}
		if (/code/.test(token)) {
			token = getUrlParams(token);
			message.error(token.msg);
			return;
		}
		if (/token/.test(token)) {
			token = getUrlParams(token);
			sessionStorage.setItem("AuthorizationCode", token.token);
			window.location.href =
				window.location.href.split("?")[0] + "#/system";
		}
	}, []);

	return (
		<div className="login-page">
			<div className="theme-box">
				<div className="theme-title">
					<img className="theme-logo" src={Logo} alt="" />
					<span>浙江省教材管理系统</span>
				</div>
				<img className="theme-back" src={Back} alt="" />
			</div>
			<div className="login-box">
				<div className="the-form">
					<div className="the-login-title">账号登录</div>
					<AccountLogin />
				</div>
			</div>
		</div>
	);
}

export default Login;
